<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta http-equiv="Cache-Control" content="no-transform">
		<meta http-equiv="Cache-Control" content="no-siteapp">
		<meta name="applicable-device" content="pc,mobile">
		<meta name="renderer" content="webkit">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<title>HOME</title>
		
		<!-- Stylesheet -->
		<link href="assets/css/index.css" rel="stylesheet">
		
	</head>
	
	<body>
		
		<div id="root">
		
			<div class="header clearfix">
				<div class="container">
					<div class="row">
						<div class="pull-left">
							<div class="logo"></div><strong class="sitename">China Federation of Literary AND ART CIRCLES</strong>
						</div>
						<div class="pull-right">
							<div class="search" :class="{ 'show': search.show }">
								<input type="text" v-model="search.value" v-focus="search.show"/>
								<i class="icon-close" @click="showSearch"></i>
								<i class="icon-search" @click="showSearch"></i>
							</div>
						</div>
					</div>
					<div class="open-nav" @click="showNav"><i></i><i></i></div>
				</div>
			</div>

			<div class="nav" :class="{ 'show': nav.show }">
				<div class="container">
					<div class="row">
						<div class="mobile-logo"></div>
						<div class="mobile-close" @click="showNav"></div>
						<ul>
              <li><a href="index.html" class="top">Home</a></li>
							<li :class="{ 'hover': nav.submenu === 1 }">
                <a class="top menu-top" @click="submenuShowEvent(1)">About us</a>
								<ul class="submenu sub-111">
									<li><a href="about-intro.html" title="Introduction">Introduction</a></li>
									<li><a href="about-organization.html" title="Organization">Organization</a></li>
									<li><a href="about-leadership.html" title="Leadership">Leadership</a></li>
								</ul>
              </li>
							<li :class="{ 'hover': nav.submenu === 2 }">
								<a class="top menu-top" @click="submenuShowEvent(2)">Brand Events</a>
								<ul class="submenu sub-148">
									<li><a href="brand-map.html" title="Cina Today Arts Week">CTAW</a></li>
									<li><a href="brand-timeline.html" title="China International Folk Arts Festival">CIFAF</a></li>
									<li><a href="brand-activities.html" title="Beijing International Art Biennale">BIAB</a></li>
									<li><a href="brand-activities.html" title="Chinese Art Forum Of Mainland, Hong Kong, Macao And Talwan">CAFMHMT</a></li>
								</ul>
							</li>
							<li :class="{ 'hover': nav.submenu === 3 }">
                <a class="top menu-top" @click="submenuShowEvent(3)">Associations</a>
								<ul class="submenu  sub-481">
									<li><a href="association-and-awards.html" title="Television">Television</a></li>
									<li><a href="association-and-awards.html" title="Tilm">Tilm</a></li>
									<li><a href="association-and-awards.html" title="Art">Art</a></li>
									<li><a href="association-and-awards.html" title="Folk literature and art">Folk literature and art</a></li>
									<li><a href="association-and-awards.html" title="Quyi">Quyi</a></li>
									<li><a href="association-and-awards.html" title="Photograph">Photograph</a></li>
									<li><a href="association-and-awards.html" title="Calligraphy">Calligraphy</a></li>
									<li><a href="association-and-awards.html" title="Dance">Dance</a></li>
									<li><a href="association-and-awards.html" title="Theatre">Theatre</a></li>
									<li><a href="association-and-awards.html" title="Music">Music</a></li>
									<li><a href="association-and-awards.html" title="Acrobatics">Acrobatics</a></li>
									<li><a href="association-and-awards.html" title="Literary and art volunteer">Literary and art volunteer</a></li>
									<li><a href="association-and-awards.html" title="Criticism">Criticism</a></li>
								</ul>
              </li>
							<li><a href="masters.html" class="top">Masters</a></li>
						</ul>
					</div>
				</div>
			</div>

			<div class="banner">
				<img src="assets/images/banner.jpg"/>
			</div>
			
			<div class="plate-1">
				<div class="nest-1">
					<div class="nest-2">
						<div class="container top-box">
							<div class="new-text"></div>
							<div class="row">
								<div class="col-lg-8 col-md-7">
									<div class="panel-default panel-news">
										<div class="panel-head">
											<div class="pull-left uppercase"><strong class="name">News</strong></div>
											<div class="pull-right uppercase"><a href="news.html">Read more</a></div>
										</div>
										<div class="panel-body">
											<ul>
												<li>
													<a href="#">
														<h3>Biosphere ressues Patashnik album</h3>
														<p>In June 1959, at the invitation of Hunan People's Publishing House, Fu Baoshi visited Changsha and Shaoshan, Hunan Province, and created a number of important works ... </p>
													</a>
												</li>
												<li>
													<a href="#">
														<h3>Biosphere ressues Patashnik album</h3>
														<p>In June 1959, at the invitation of Hunan People's Publishing House, Fu Baoshi visited Changsha and Shaoshan, Hunan Province, and created a number of important works ... </p>
													</a>
												</li>
												<li>
													<a href="#">
														<h3>Biosphere ressues Patashnik album</h3>
														<p>In June 1959, at the invitation of Hunan People's Publishing House, Fu Baoshi visited Changsha and Shaoshan, Hunan Province, and created a number of important works ... </p>
													</a>
												</li>
												<li>
													<a href="#">
														<h3>Biosphere ressues Patashnik album</h3>
														<p>In June 1959, at the invitation of Hunan People's Publishing House, Fu Baoshi visited Changsha and Shaoshan, Hunan Province, and created a number of important works ... </p>
													</a>
												</li>
												<li>
													<a href="#">
														<h3>Biosphere ressues Patashnik album</h3>
														<p>In June 1959, at the invitation of Hunan People's Publishing House, Fu Baoshi visited Changsha and Shaoshan, Hunan Province, and created a number of important works ... </p>
													</a>
												</li>
											</ul>
										</div>
									</div>
								</div>
								<div class="col-lg-4 col-md-5">
									<div class="panel-intro">
										<h3>It will open in 40provinces, 88 days and 25 thous and kilometers in 18 provinces.</h3>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			
			<div class="plate-2">
				<div class="container-fluid list-1">
					<div class="row">
						<div class="col-md-3 col-xs-6 item">
							<a href="#">
								<img src="demo/001.jpg"/>
								<span class="text">China Today Arts Week</span>
							</a>
						</div>
						<div class="col-md-3 col-xs-6 item">
							<a href="#">
								<img src="demo/002.jpg"/>
								<span class="text">International  Art Biennale</span>
							</a>
						</div>
						<div class="col-md-3 col-xs-6 item">
							<a href="#">
								<img src="demo/003.jpg"/>
								<span class="text">Cross-strait Art Forum</span>
							</a>
						</div>
						<div class="col-md-3 col-xs-6 item">
							<a href="#">
								<img src="demo/004.jpg"/>
								<span class="text">International Folk Arts Festival</span>
							</a>
						</div>
					</div>
				</div>
				
				<div class="container list-2">
					<div class="row">
						<div class="col-md-4 col-xs-6 item">
							<a href="#">
								<img src="demo/005.jpg"/>
								<span class="text">Television </span>
							</a>
						</div>
						<div class="col-md-4 col-xs-6 item">
							<a href="#">
								<img src="demo/006.jpg"/>
								<span class="text">Film</span>
							</a>
						</div>
						<div class="col-md-4 col-xs-6 item">
							<a href="#">
								<img src="demo/007.jpg"/>
								<span class="text">Find Arts</span>
							</a>
						</div>
						<div class="col-md-4 col-xs-6 item">
							<a href="#">
								<img src="demo/008.jpg"/>
								<span class="text">Folk Literature and Arts</span>
							</a>
						</div>
						<div class="col-md-4 col-xs-6 item">
							<a href="#">
								<img src="demo/009.jpg"/>
								<span class="text">Chinese Quyi</span>
							</a>
						</div>
						<div class="col-md-4 col-xs-6 item">
							<a href="#">
								<img src="demo/010.jpg"/>
								<span class="text">Photography</span>
							</a>
						</div>
						<div class="col-md-4 col-xs-6 item">
							<a href="#">
								<img src="demo/011.jpg"/>
								<span class="text">Calligraphy</span>
							</a>
						</div>
						<div class="col-md-4 col-xs-6 item">
							<a href="#">
								<img src="demo/012.jpg"/>
								<span class="text">Dance</span>
							</a>
						</div>
						<div class="col-md-4 col-xs-6 item">
							<a href="#">
								<img src="demo/013.jpg"/>
								<span class="text">Theatre</span>
							</a>
						</div>
						<div class="col-md-4 col-xs-6 item">
							<a href="#">
								<img src="demo/014.jpg"/>
								<span class="text">Music</span>
							</a>
						</div>
						<div class="col-md-4 col-xs-6 item">
							<a href="#">
								<img src="demo/015.jpg"/>
								<span class="text">Acrobatics</span>
							</a>
						</div>
						<div class="col-md-4 col-xs-6 item">
							<a href="#"><img src="assets/images/bg_more.png"/><span class="text">Litearary and Art Criticism</span></a>
						</div>
					</div>
				</div>
			
				<div class="container bottom-box">
					<div class="row">
						<div class="col-lg-8 col-md-7">
              <div class="panel-name">Video  Clips</div>
							<a href="video.html" class="video-window"><img src="demo/020.jpg"/><i></i></a>
						</div>
						<div class="col-lg-4 col-md-5">
              <div class="panel-name">Periodical - <i>Art Exchange</i></div>
							<div class="panel-default panel-magazine">
                <div class="inner">
                  <a href="#" class="image"><img src="demo/016.jpg"/></a>
                  <a href="#" class="image"><img src="demo/017.jpg"/></a>
                  <div class="button">
                    <a href="#">READE NOW</a>
                  </div>
                </div>
							</div>
						</div>
					</div>
				</div>
			</div>
			
			<div class="footer">
        <div class="container-fluid">
          <div class="col-md-6 text-left infos">
            <strong>www.cflac.org.cn</strong>
            <span>Tel:86-10-59759785</span>
            <span>Fax:86-10-59759792</span>
            <span>E-mail: cflac-ild@vip.sina.com</span><br>
            Tower A, Building 32, No. 1 Beishatan, ChaoyangDistrict, Beijing, 100083, China
          </div>
          <div class="col-md-6 text-right"><div class="logo"></div></div>
          <div class="col-xs-12 text-center">
            <div class="copyright">Copyright &copy; 2018 CFLAC Corporation, All Rights Reserved</div>
          </div>
        </div>
			</div>
			
		</div>
		
		<!-- Script -->
		<script src="assets/js/vendor/vue.min.js"></script>
		<script src="assets/js/index.js"></script>
		
	</body>
</html>